<include file="public@header"/>
<style type="text/css">
    .pic-list li{margin-bottom: 5px;}
    .tab-pane{display: none;visibility: hidden;}
    .active{display: block;visibility: visible;}
    .radio-common.selected{background-position: 0;}
    .radio-common{background: url(/themes/admin_simpleboot3/admin/stock/images/ns_common_radio.png) no-repeat;width: 16px !important;height: 16px !important;display: inline-block;vertical-align: middle;background-position: -18px 0;}
    .radio-common+span, .checkbox-common+span{vertical-align: middle;font-weight: 100;}
    .radio.inline, .checkbox.inline{display: inline-block;padding-top: 5px;margin-bottom: 0;vertical-align: middle; margin-right: 15px;float: left;}
    .radio input[type="radio"], .checkbox input[type="checkbox"]{margin-left: -18px;}
    .radio-common input[type="radio"]{width: 16px !important;height: 16px !important;vertical-align: middle;opacity: 0;}
    .freight{float:left;width: 50%}
</style>
<script type="text/html" id="photos-item-tpl">
    <li id="saved-image{id}">
        <input id="photo-{id}" type="hidden" name="photo_urls[]" value="{filepath}">
        <input class="form-control" id="photo-{id}-name" type="text" name="photo_names[]" value="{name}"
               style="width: 200px;" title="图片名称">
        <img id="photo-{id}-preview" src="{url}" style="height:36px;width: 36px;"
             onclick="imagePreviewDialog(this.src);">
        <a href="javascript:uploadOneImage('图片上传','#photo-{id}');">替换</a>
        <a href="javascript:(function(){$('#saved-image{id}').remove();})();">移除</a>
    </li>
</script>
<script type="text/html" id="files-item-tpl">
    <li id="saved-file{id}">
        <input id="file-{id}" type="hidden" name="file_urls[]" value="{filepath}">
        <input class="form-control" id="file-{id}-name" type="text" name="file_names[]" value="{name}"
               style="width: 200px;" title="文件名称">
        <a id="file-{id}-preview" href="{preview_url}" target="_blank">下载</a>
        <a href="javascript:uploadOne('文件上传','#file-{id}','file');">替换</a>
        <a href="javascript:(function(){$('#saved-file{id}').remove();})();">移除</a>
    </li>
</script>
</head>
<body>
<div class="wrap js-check-wrap">
    <ul class="nav nav-tabs">
        <li><a href="{:url('Stock/index')}">商品管理</a></li>
        <li class="active"><a href="{:url('Stock/add_good')}">添加商品</a></li>
    </ul>
    <div class="panel panel-default" style="margin: 10px 0;">
        <div class="panel-body">
            <ul class="nav nav-pills">
                <li role="presentation" class="active"><a href="#tab_basic" aria-controls="tab_basic" role="tab" data-toggle="pill">基本设置</a></li>
                <!--<li role="presentation" class=""><a href="#tab_content" aria-controls="tab_content" role="tab" data-toggle="pill">商品详情</a></li>-->
                <!--<li role="presentation" class=""><a href="#tab_commission" aria-controls="tab_commission" role="tab" data-toggle="pill">佣金设置</a></li>-->
                <!--<li role="presentation" class=""><a href="#tab_options" aria-controls="tab_options" role="tab" data-toggle="pill">规格设置</a></li>-->
                <!--<li role="presentation" class=""><a href="#tab_time" aria-controls="tab_time" role="tab" data-toggle="pill">售卖时间</a></li>-->
            </ul>
        </div>
    </div>
    <form action="{:url('Stock/add_good')}" method="post" class="form-horizontal js-ajax-form margin-top-20">
        <div class="tab-pane active" id="tab_basic">
            <div class="row">
                <div class="col-md-9">
                    <table class="table table-bordered">
                        <tr>
                            <th width="100">商品分类<span class="form-required">*</span></th>
                            <td>
                                <input class="form-control" type="text" style="width:400px;" required value=""
                                       placeholder="请选择商品分类" onclick="doSelectCategory();" id="js-categories-name-input"
                                       readonly/>
                                <input class="form-control" type="hidden" value="" name="post[categories]"
                                       id="js-categories-id-input"/>
                            </td>
                        </tr>
                        <tr>
                            <th>商品名称<span class="form-required">*</span></th>
                            <td>
                                <input class="form-control" type="text" name="post[post_title]" id="title" required value="" placeholder="请输入商品名称"/>
                            </td>
                        </tr>
                        <tr>
                            <th>商品关键词</th>
                            <td>
                                <input class="form-control" type="text" name="post[post_keywords]" id="keywords" value="" placeholder="请输入商品关键字">
                                <p class="help-block">多关键词之间用英文逗号隔开</p>
                            </td>
                        </tr>
                        <tr>
                            <th>商品原价<span class="form-required">*</span></th>
                            <td  class="input-group"  style="padding-right: 50%;"><input class="form-control" type="text" name="post[post_old_price]"  value="" required placeholder="请输入商品原价"><span class="input-group-addon">元</span></td>
                        </tr>
                        <tr>
                            <th>商品售价<span class="form-required">*</span></th>
                            <td  class="input-group" style="padding-right: 50%;"><input class="form-control" type="text" name="post[post_price]"  value="" required placeholder="请输入商品售价"><span class="input-group-addon">元</span><span style="background: none;border: none;padding: 6px 12px;color: #333333;width: 1%;white-space: nowrap;vertical-align: middle;display: table-cell;">+</span><input class="form-control" type="text" name="post[post_score]"  value="" required placeholder="请输入商品积分价"><span class="input-group-addon">积分</span></td>
                        </tr>

                        <tr>
                            <th>商品库存<span class="form-required">*</span></th>
                            <td ><input class="form-control" type="text" name="post[post_stock]"  value="" required placeholder="请输入商品库存"></td>
                        </tr>
                        <tr>
                            <th>运费<span class="form-required">*</span></th>
                            <td >
                                <label class="radio inline normal">
                                    <i class="radio-common selected">
                                        <input type="radio" name="post[shipping_fee_type]" value="4" checked="checked">
                                    </i>
                                    <span>固定运费</span>
                                </label>
                                <label class="radio inline normal">
                                        <i class="radio-common">
                                            <input type="radio" name="post[shipping_fee_type]" value="1">
                                        </i>
                                        <span>重量</span>
                                    </label>
                                <label class="radio inline normal">
                                    <i class="radio-common">
                                        <input type="radio" name="post[shipping_fee_type]" value="2">
                                    </i>
                                    <span>体积</span>
                                </label>
                                <label class="radio inline normal">
                                    <i class="radio-common">
                                        <input type="radio" name="post[shipping_fee_type]" value="3">
                                    </i>
                                    <span>计件</span>
                                </label>
                                <div class="yunfei">
                                    <span style="float: left;height: 34px; line-height: 34px;margin-right: 6px;">运费:</span>
                                    <input class="form-control freight" type="text" name="post[shipping_fee]"  value=""  placeholder="请输入固定运费，0为免运费" >
                                </div>
                                <div class="zhongliang" style="display: none;">
                                    <span style="float: left;height: 34px; line-height: 34px;margin-right: 6px;">重量(kg):</span>
                                    <input class="form-control freight" type="text" name="post[goods_weight]"  value=""  placeholder="请输入重量" >
                                </div>
                                <div class="tiji" style="display: none;">
                                    <span style="float: left;height: 34px; line-height: 34px;margin-right: 6px;">体积(立方米):</span>
                                    <input class="form-control freight" type="text" name="post[goods_volume]"  value=""  placeholder="请输入体积" >
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <th>运费模版<span class="form-required">*</span></th>
                            <td>
                                <select class="form-control" name="post[shipping_tpl]"  style="width: 30%;">
                                    <option value="0">请选择模板</option>
                                    <foreach name="fright_list" item="vo">
                                        <option value="{$vo.id}">运费模版：{$vo.freight_tpl}</option>
                                    </foreach>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <th>商品摘要</th>
                            <td>
                                <textarea class="form-control" name="post[post_excerpt]" style="height: 50px;" placeholder="请填写商品摘要"></textarea>
                            </td>
                        </tr>
                        <tr>
                            <th>商品内容<span class="form-required">*</span></th>
                            <td>
                                <script type="text/plain" id="content" name="post[post_content]"></script>
                            </td>
                        </tr>
                        <tr>
                            <th>商品相册<span class="form-required">*</span></th>
                            <td>
                                <ul id="photos" class="pic-list list-unstyled form-inline"></ul>
                                <a href="javascript:uploadMultiImage('图片上传','#photos','photos-item-tpl');"
                                   class="btn btn-default btn-sm">选择图片</a>
                            </td>
                        </tr>
                        <tr>
                            <th>商品附件</th>
                            <td>
                                <ul id="files" class="pic-list list-unstyled form-inline">
                                </ul>
                                <a href="javascript:uploadMultiFile('附件上传','#files','files-item-tpl','file');"
                                   class="btn btn-sm btn-default">选择文件</a>
                            </td>
                        </tr>
                    </table>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            <button type="submit" class="btn btn-primary js-ajax-submit">{:lang('ADD')}</button>
                            <a class="btn btn-default" href="{:url('Stock/index')}">{:lang('BACK')}</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <table class="table table-bordered">
                        <tr>
                            <th><b>商品缩略图<span class="form-required">*</span></b></th>
                        </tr>
                        <tr>
                            <td>
                                <div style="text-align: center;">
                                    <input type="hidden" name="post[more][thumbnail]" id="thumbnail" value="">
                                    <a href="javascript:uploadOneImage('图片上传','#thumbnail');">
                                        <img src="__TMPL__/public/assets/images/default-thumbnail.png"
                                             id="thumbnail-preview"
                                             width="135" style="cursor: pointer"/>
                                    </a>
                                    <input type="button" class="btn btn-sm btn-cancel-thumbnail" value="取消图片">
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <th><b>发布时间</b></th>
                        </tr>
                        <tr>
                            <td>
                                <input class="form-control js-bootstrap-datetime" type="text" name="post[published_time]"
                                       value="{:date('Y-m-d H:i:s',time())}">
                            </td>
                        </tr>

                        <tr>
                            <th>商品模板</th>
                        </tr>
                        <tr>
                            <td>
                                <select class="form-control" name="post[more][template]" id="more-template-select">
                                    <option value="">请选择模板</option>
                                    <foreach name="article_theme_files" item="vo">
                                        <php>$value=preg_replace('/^portal\//','',$vo['file']);</php>
                                        <option value="{$value}">{$vo.name} {$vo.file}.html</option>
                                    </foreach>
                                </select>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        <script type="text/html" id="distance-form-html">
            <div class="form-group">
                <label class="col-xs-12 col-sm-3 col-md-2 control-label"></label>
                <div class="col-sm-7 good_options">
                    <div class="input-group">
                        <span class="input-group-addon" style="width: 67px;">排序：</span>
                        <input type="text" class="form-control" value="999" name="optiondisplayorder[]" >
                        <span class="input-group-addon" style="width: 67px;">规格名：</span>
                        <input type="text" class="form-control" value="" name="optionstart[]">
                        <span class="input-group-addon option_title" style="display: none">属性：</span>

                        <input type="hidden" class="form-control x_options" value="" name="optiontitle[]" >
                    </div>
                </div>
                <div class="col-sm-3 add_option">
                    <div class="add-sku-value-input " style="display: none;width: 50%;float: left;">
                        <input type="text" class="form-control" placeholder="输入规格值名称" style="width: 70%;float: left;" >
                        <a class="btn btn-success addoption_btn"  href="javascript:;">确定</a>
                    </div>
                    <a class="btn btn-success addoption"  href="javascript:;">添加属性</a>
                    <a class="btn btn-danger" onclick="$(this).parents('.form-group').remove(); return false;" href="javascript:;">删除</a>
                </div>
            </div></script>
        <script type="text/javascript">
           $(function () {
               $('#add-distance').click(function(){
                   $('#distance-list').append($('#distance-form-html').html());
               });
               $("#distance-list").on("click", ".addoption", function () {
                   $(this).hide();
                   $(this).siblings('.add-sku-value-input').show();
               });
               $("#distance-list").on("click", ".addoption_btn", function () {
                   var op=$(this).siblings('input').val();
                   $(this).parents('.add_option').siblings('.good_options').children('.input-group').children('.option_title').show();
                   var start= $(this).parents('.add_option').siblings('.good_options').children('.input-group').children('.x_options').val();
                   var html='<a href="javascript:;" class="label label-primary del_option" style="margin-right:2px" data="'+op+'">'+op+'</a>';
                   $(this).parents('.add_option').siblings('.good_options').children('.input-group').children('.option_title').append(html);
                   if(start){
                       $(this).parents('.add_option').siblings('.good_options').children('.input-group').children('.x_options').val(start+','+op);
                   }else{
                       $(this).parents('.add_option').siblings('.good_options').children('.input-group').children('.x_options').val(op);
                   }
               });
               $("#distance-list").on("click", ".del_option", function () {
                    var info;
                  $(this).siblings().each(function(index){
                      if(index==0){
                          info=$(this).attr('data')
                      }else{
                          info=info+','+$(this).attr('data')
                      }

                  });
                   $(this).parents('.option_title').siblings('.x_options').val(info);
                   $(this).remove();

               });


           })

        </script>
        <!--<div class="tab-pane" id="tab_options">-->
            <!--<div class="lastest-notification alert alert-info">-->
                <!--<div class="notification-label">-->
                    <!--温馨提示:<br>-->
                    <!--使用商品属性功能需要先在商品基本信息中开启商品属性，开启商品属性后顾客下单将按照你设置的商品属性进行选择，商品的最终价格是基本信息中商品的基础价格与选择的各属性价格总和，如果不希望某个属性值带上价格，可以将它的属性价格设为0，商品属性可灵活运用于各场景，比如套餐、大杯小杯、冷饮热饮、辣或不辣等等。-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="panel panel-default">-->
                <!--<div class="panel-heading">-->
                    <!--规格设置-->
                <!--</div>-->
                <!--<div class="panel-body">-->
                    <!--<div class="form-group">-->
                        <!--<label class="col-xs-12 col-sm-3 col-md-2 control-label">启用商品规格</label>-->
                        <!--<div class="col-sm-9">-->
                            <!--<div class="radio radio-info radio-inline">-->
                                <!--<input type="radio" id="isoptions1" value="1" name="isoptions">-->
                                <!--<label for="isoptions1"> 开启 </label>-->
                            <!--</div>-->
                            <!--<div class="radio radio-info radio-inline">-->
                                <!--<input type="radio" id="isoptions2" value="0" name="isoptions" checked="">-->
                                <!--<label for="isoptions2"> 关闭 </label>-->
                            <!--</div>-->
                            <!--<div class="radio radio-info radio-inline">-->
                                <!--请设置添加 <a id="add-distance" style="color: #428bca;"><i class="fa fa-plus-circle"></i>-->
                                <!--添加规格</a>-->
                            <!--</div>-->
                            <!--<div class="help-block">-->
                                <!--<font color="#f00">（注意：开启此功能，需要设置下方商品属性内容，否则将影响下单。）</font>-->
                                <!--<br>-->
                                <!--（商品最终价格=商品设置的价格+属性加价）-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div id="distance-list">-->
                      <!--&lt;!&ndash; 规格栏&ndash;&gt;-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="panel panel-default">-->
                <!--<div class="panel-heading">-->
                    <!--库存设置-->
                <!--</div>-->
                <!--<div class="panel-body">-->
                    <!--<div>-->
                        <!--&lt;!&ndash; 库存栏&ndash;&gt;-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
        <!--</div>-->
    </form>
</div>
<script type="text/javascript" src="__STATIC__/js/admin.js"></script>
<script type="text/javascript">
    //编辑器路径定义
    var editorURL = GV.WEB_ROOT;
</script>
<script type="text/javascript" src="__STATIC__/js/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__STATIC__/js/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript">
    $(function () {
//公共单选框点击切换样式
        $('.radio-common').click(function () {
            var radio = $(this).children("input");
            var name = radio.attr("name");
            var val=radio.val();
            if(val==4){
                $('.yunfei').show();
                $('.zhongliang').hide();
                $('.tiji').hide();
            }
            if(val==1){
                $('.zhongliang').show();
                $('.yunfei').hide();
                $('.tiji').hide();
            }
            if(val==2){
                $('.tiji').show();
                $('.yunfei').hide();
                $('.zhongliang').hide();
            }
            if(val==3){
                $('.tiji').hide();
                $('.yunfei').hide();
                $('.zhongliang').hide();
            }
            if(radio.is(":checked")){
                $(".radio-common>input[type='radio'][name='" + name + "']").parent().removeClass("selected");
                $(this).addClass("selected");
            }else{
                $(this).removeClass("selected");
            }
        })
        editorcontent = new baidu.editor.ui.Editor();
        editorcontent.render('content');
        try {
            editorcontent.sync();
        } catch (err) {
        }

        $('.btn-cancel-thumbnail').click(function () {
            $('#thumbnail-preview').attr('src', '__TMPL__/public/assets/images/default-thumbnail.png');
            $('#thumbnail').val('');
        });

    });

    function doSelectCategory() {
        var selectedCategoriesId = $('#js-categories-id-input').val();
        openIframeLayer("{:url('Stock/select')}?ids=" + selectedCategoriesId, '请选择分类', {
            area: ['700px', '400px'],
            btn: ['确定', '取消'],
            yes: function (index, layero) {
                //do something

                var iframeWin          = window[layero.find('iframe')[0]['name']];
                var selectedCategories = iframeWin.confirm();
                if (selectedCategories.selectedCategoriesId.length == 0) {
                    layer.msg('请选择分类');
                    return;
                }
                $('#js-categories-id-input').val(selectedCategories.selectedCategoriesId.join(','));
                $('#js-categories-name-input').val(selectedCategories.selectedCategoriesName.join(' '));
                //console.log(layer.getFrameIndex(index));
                layer.close(index); //如果设定了yes回调，需进行手工关闭
            }
        });
    }

</script>
</body>
</html>
